class MessageBox {
    constructor(options) {
        for(let key in options) {
            if(!options.hasOwnProperty(key)) break;
            this[key] = options[key];
        }
        this.init();
    }
    init() {if(this.status === "message") {this.createMessage();this.open();return;}}
    createMessage() {
        this.messageBox = document.createElement('div');
        this.messageBox.className = `dpn-message dpn-${this.type}`;
        this.messageBox.innerHTML = `${this.message}<i class="dpn-close">X</i>`;
        document.body.appendChild(this.messageBox);
        this.messageBox.onclick = ev => {
            let target = ev.target;
            if(target.className === "dpn-close") {this.close();}
        };
        this.oninit();
    }
    open() {
        if(this.status === "message") {
            let messageBoxs = document.querySelectorAll('.dpn-message'),len = messageBoxs.length;
            this.messageBox.style.top = `${len===1 ? 20:20+(len-1)*70}px`;
            this.autoTimer = setTimeout(() => {this.close();}, this.duration);
            this.onopen();
            return;
        }
    }
    close() {
        if(this.status === "message") {
            clearTimeout(this.autoTimer);
            this.messageBox.style.top = '-200px';
            let anonymous = () => {document.body.removeChild(this.messageBox);this.onclose();};
            this.messageBox.addEventListener('transitionend', anonymous);
            return;
        }
    }
}
window.messageplugin = function(options = {}) {
    if(typeof options === "string") {options = { message: options };}
    options = Object.assign({status: 'message', message: '我是默认信息', type: 'info', duration: 3000, oninit() {}, onopen() {}, onclose() {},}, options);
    return new MessageBox(options);
};